/**
 * @功能描述: 横向树状图表demo页面
 * @author: lzn
 * @date: 2022-09-26 15:53:51
 * @version: 1.0
 */
<script setup>
import * as echarts from 'echarts';
import { onMounted } from 'vue';
import { options } from './baseTreeChart.js';

onMounted(() => {
  var chartDom = document.getElementById('xTree');
  var myChart = echarts.init(chartDom);
  const data = 
    {name: 'flare', children: [
      { name: 'analysis', collapsed: true, children: [{ name: 'clister', value: 1 }] },
      { name: 'woelqw', collapsed: false, children: [{ name: 'dddd', value: 1 }] },
      { name: 'sjicoas', collapsed: true, children: [{ name: 'ffff', value: 1 }] },
    ]};
  data.children.forEach(function (datum, index) {
    index % 2 === 0 && (datum.collapsed = true);
  });
  const option = options(data);
  
  myChart.setOption(option);
})


</script>

<template>
  <div id="xTree" />
</template>

<style scoped>
  #xTree {
    width: 400px;
    height: 400px;
  }
</style>